<template>
  <div>
    <footer>
      <div class="footer">
        <span class="iconfont icon-shouye" ></span>
        <router-link to="../Three">
          <p class="wenzi">首页</p>
        </router-link>
        </div>
      <!-- 2 -->
         <div class="footer">
        <span class="iconfont icon-douzikongxin" ></span>
        <router-link to="../Four">
          <p class="wenzi">聚豆</p>
        </router-link>
        </div>
        <!-- 3 -->
           <div class="footer">
        <span class="iconfont icon-faxian" ></span>
        <router-link to="../Five">
          <p class="wenzi">发现</p>
        </router-link>
        </div>
        <!-- 4 -->
           <div class="footer">
        <span class="iconfont icon-wode" ></span>
        <router-link to="../Six">
          <p class="wenzi">我的</p>
        </router-link>
        </div>
    </footer>
  </div>
</template>

<script>
import getapi from "@/apis/getapi.js";

export default {
  data() {
    return {
      arr1: [],
    };
  },
  mounted() {
    getapi("/xiaojiang").then((ok) => {
      this.arr1 = ok.data.data5;

      // console.log(ok);
    });
  },
};
</script>

<style scoped>
footer {
  width: 100%;
  height: 0.6rem;
  display: flex;
  justify-content: space-between;
  /* position: fixed; */
}
.footer{
  width: 25%;
  height: 0.6rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  z-index: 5;
}
.footer span{
  width: 100%;
  height: 0.4rem;
  text-align: center;
  line-height: 0.4rem;
  font-size: .2rem;
  color: #a0a0a0;
}
.wenzi{
  height: 0.2rem;
  width: 100%;
  font-size: .16rem;
  /* color: blue; */
  text-align: center;
  line-height: 0.2rem;
  color: #151513;
}
a {
text-decoration: none;
color: #232323;
height: 0.2rem;
}
</style>